{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>更改用户密码</title>
    <!-- 引入 layui.css -->
    <link href="{%static '/css/layui.css'%}" rel="stylesheet">
    <link href="{%static '/css/font-awesome.min.css'%}" rel="stylesheet">
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <div class="layui-form">
            <div class="layui-form-item">
                <label for="L_repass" class="layui-form-label">
                    <span class="x-red">*</span>旧密码</label>
                <div class="layui-input-inline">
                    <input type="password" id="L_repass1" name="oldpass" required="" lay-verify="required" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="L_pass" class="layui-form-label">
                    <span class="x-red">*</span>新密码</label>
                <div class="layui-input-inline">
                    <input type="password" id="L_pass" name="newpass" required="" lay-verify="required" autocomplete="off" class="layui-input"></div>
                <div class="layui-form-mid layui-word-aux">6到16个字符</div></div>
            <div class="layui-form-item">
                <label for="L_repass" class="layui-form-label">
                    <span class="x-red">*</span>确认密码</label>
                <div class="layui-input-inline">
                    <input type="password" id="L_repass" name="repass" required="" lay-verify="required" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="L_repass" class="layui-form-label"></label>
                <button class="layui-btn layui-btn-primary" id="btn_change" >确认修改</button></div>
        </div>
    </div>
</div>


<script src="{%static '/js/layui.min.js'%}" charset="utf-8"></script>
<script>
    layui.use(['layer','jquery','table'], function () {
        var $ = layui.jquery,
            layer = layui.layer,
            table = layui.table;

        $("#btn_change").click(function(){
           old_pwd = $("#L_repass1").val()
           new_pwd = $("#L_pass").val()
           cha_pwd = $("#L_repass").val()
           if(new_pwd.length<6){
               layer.msg("密码位数不足")
               return
           }
           if (new_pwd!=cha_pwd){
               layer.msg("两次输入的密码不一致")
               return
           }
           url="/api/user/changepwd/"
           $.ajax({
               url:url,
               type:'post',
               data:{
                   "user_id":'{{user_id}}',
                   "old_pwd":old_pwd,
                   "new_pwd":new_pwd
               },
               dataType:"json",
               success:function(res){
                   if(res.code==200){
                       layer.msg(res.msg,{icon:1,time:1*1000,shade:0.4},function(){
                           location.href="/index";
                       });
                   }
                   else{
                       layer.msg(res.msg,{time:1*1000});
                   }
               },
               error:function(err){
                   layer.msg("修改出错",{time:1*1000});
               }
           });
        });
    });
</script>
</body>
</html>